﻿@using System.Threading
@using System.Web.Optimization
@{
    Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Simple Task System</title>

    <link href="~/Content/bootstrap.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-2.1.4.js"></script>
    <script src="~/Scripts/bootstrap.js"></script>
    <script src="~/Scripts/angular.js"></script>
    <script src="~/Scripts/jquery.signalR-2.2.1.js"></script>
    <script src="~/signalr/hubs"></script>
</head>
<body ng-app="app">
    <div class="container" ng-controller="GuessTheNumberController">

        <h3>授课区</h3>
        用户名： <input type="text" id="accountname" class="input-sm" ng-model="AccountName" />
        <textarea id="txtMessage" ng-model="msgContent" class="span6 m-wrap" rows="3"></textarea>
        <button ng-click="task()" class="btn btn-primary btn-sm">发送</button>
        <table class="table table-hover">
            <tr ng-repeat="msg in tempmsgs track by $index |orderBy:'Id'" class="alert alert-warning" id="{{msg.Id}}">
                <td class="alert alert-warning">
                    {{msg.Id}}:{{msg.msgContent}} {{msg.CreateOn}} 状态：{{msg.State}} 著作：{{msg.AccountName}} 当前：{{AccountName}} {{msg.AccountName==AccountName}}
                    <span ng-show="msg.AccountName==AccountName">
                        <button ng-show="msg.State==0" id="btnPass" ng-click="Pass(msg)">通过</button>
                        <button ng-show="msg.State==0" id="btnNoPass" ng-click="NoPass(msg)">不通过</button>
                        <button ng-show="msg.State==1" id="Sail" ng-click="Sail(msg)">马上屏蔽</button>
                        <button ng-show="msg.State==3" id="btnNoPass" disabled="disabled">已屏蔽</button>
                        <button ng-show="msg.State==2" id="btnNoPass" disabled="disabled">不通过</button>
                    </span>
                </td>
            </tr>
        </table>
    </div>
    <script type="text/javascript">
        var chatHub = $.connection.chatHub;

        angular.module('app', [])
            .controller('GuessTheNumberController', GuessTheNumberController).value("chatHub", chatHub);

        function GuessTheNumberController($scope) {
            chatHub.client.addNewMessageToPage = function (msg) {
                console.log("addNewMessageToPage 有新消息");
                if (msg.AccountName != $scope.AccountName)
                    $scope.tempmsgs.push(msg);
                $scope.$apply();
            };
            chatHub.client.UpdateMessageToPage = function (msg) {
                console.log("UpdateMessageToPage 更新消息");

                //var msg=  $scope.GetMsgById(msg.Id) = msg;

                //$scope.$apply();
            };

            $scope.AccountName = Math.random();;
            $scope.tasklist = new Array();
            $scope.tempmsgs = new Array();
            $scope.task = function () {
                var msg = {
                    "Id": Math.random() + "",
                    "msgContent": $scope.msgContent,
                    "CreateOn": Date("yyyyMMdd"),
                    "State": 0, "AccountName": $scope.AccountName
                };

                setTimeout(function () {
                    //msg.State = 1;
                    $scope.sendMessage(msg);
                }, 5000);
                $scope.tempmsgs.push(msg);
                $scope.msgContent = "";

            }
            //马上通过 并发送服务器，和推送其他在线人员
            $scope.Pass = function (msg) {
                $scope.sendMessage(msg);
            }
            //不通过
            $scope.NoPass = function (msg) {

                msg.State = 2;


            }
            //马上屏蔽
            $scope.Sail = function (msg) {
                //var msg = $scope.GetMsgById(Id);
                msg.State = 3;
                //$scope.updateMessage(msg);
                $.connection.hub.start().done(function () {
                    chatHub.server.update(msg);
                    //chatHub.server.Update(msg);
                });

            }

            //   $scope.$apply();

            $scope.updateMessage = function (msg) {
                $.connection.hub.start().done(function () {

                    chatHub.server.UpdateMessage(msg);
                });
            }
            $scope.sendMessage = function (msg) {
                if (msg.State == 0) {
                    msg.State = 1
                    $.connection.hub.start().done(function () {

                        chatHub.server.send(msg);
                        try {
                            //$scope.$apply();
                        } catch (e) {

                        }

                    });

                    console.log("发送成功");
                }
                else {
                    console.log("不通过");
                }
            }
            $scope.GetMsgById = function (Id) {
                //console.log('Id：' + Id);
                var re;
                $.each($scope.tempmsgs, function (index, item) {
                    if (item.Id == Id) {
                        re = item;
                        return false;
                    }
                });
                return re;
            }
            $.connection.hub.start().done(function () {
            });
        }
    </script>
</body>
</html>
<script>
    $(function () {
    });
    function htmlEncode(value) {

        var encodedValue = $('<div />').text(value).html();

        return encodedValue;

    }
</script>